{extend name="public/base"/}
{block name="style"}
{/block}
{block name="body"}
{include file="public/header" /}
      <div class="bodySection">
            
    <div class="centerSection">

        <div class="userLeft_block">
		{include file="public/leftuser" /}
		</div>
        <div class="userRight_block">
            <div class="userMoney">
                <div class="section_title2">修改资料</div>
                <div class="updateAuthor">
                    <form id="myform" onsubmit="return false">
                        <div class="editUserBlock">
                            <div class="editUserBlock_top">
                                <div class="editUserBlock_header" style="height: 50px;display: none ">
                                    <div class="tips" style="margin: auto;">提示：</div>
                                </div>
                                <div class="editUserBlock_header">
                                    <div class="left">头像：</div>
                                    <div class="header"><a href=""><img src="{$avatar}" alt="" id="headimg"></a></div>
                                    <div class="tips">尺寸不能小于200*200哦～</div>
                                </div>
                                <div class="editUserBlock_shuoming">
                                    本地上传：选择本地图片编辑后上传（上传头像将会在2个工作日内进行审核，通过后需重新登录显示新头像）。<br/>
                                    支持jpg、gif、png格式图片，上传文件大小不超过5MB，图片尺寸需大于200*200。
                                </div>

                                <div class="editUserBlock_buttonList">
                                    <a class="active" onclick="setheadimg(1)" id="headimg2">
                                        本地上传
                                        <input type="file" id="imgUpload" name="headimg"/>
                                    </a>
                                    <a onclick="setheadimg(2)" id="headimg1">使用系统默认头像</a>
                                </div>
                            </div>

                        </div>

                        <div class="formSection">
                            <div class="footerSection_lis">
                                <span class="left">昵称：</span>
                                <span class="right"  style="width: 400px; position: relative;">
                                   <span class="errorTips" style="display: none;" id="nicknamemess">昵称重复</span>
                                   <input type="text" value="U14770" placeholder="无" id="nickname" class="inputStyle001"  />
                              </span>
                            </div>
                            <div class="footerSection_lis">
                                <span class="left">手机：</span>
                                <span class="right" style="width: 400px; position: relative;">
                                   <span class="errorTips" style="display: none" id="phonemess">格式有误</span>
                                   <input type="text" value="13993309314"  placeholder="无" id="phone"  class="inputStyle001"  />
                            </span>
                            </div>
                            <div class="footerSection_lis">
                                <span class="left">验证码：</span>
                                <span class="right" style="width: 270px; position: relative;">
                                   <span class="errorTips" style="display: none" id="codemess">验证码有误</span>
                                   <input type="text" value=""  id="code2"  class="inputStyle002" />
                            </span>
                                <span class="codeButton" id="getcode"  onselectstart="return false;">获取验证码</span>
                            </div>
                            <div class="footerSection_lis">
                                <span class="left">密码：</span>
                                <span class="right"  style="width: 400px; position: relative;">
                                <span class="errorTips" style="display: none" id="passwordmess">格式有误</span>
                                   <input type="password" value="" placeholder=""  id="password" class="inputStyle001"  />
                              </span>
                            </div>
                            <div class="footerSection_lis">
                                <span class="left">确认密码：</span>
                                <span class="right"  style="width: 400px; position: relative;">
                                   <span class="errorTips" style="display: none" id="password2mess">格式有误</span>
                                   <input type="password" value="" placeholder="" id="password2" class="inputStyle001"   />
                              </span>
                            </div>
                            <div class="footerSection_lis">
                                <span class="left">简介：</span>
                                <span class="right" style="position: relative;">
                                    <span class="errorTips" style="width: 180px;top: 28px;display: none">您发布的内容包含违规信息</span>
                                    <span class="fontSize">120/150</span>
                                   <textarea name=""  cols="30" rows="10" id="intro" placeholder="个人简介" style="width: 458px;"></textarea>
                              </span>
                            </div>
                        </div>
                        <div class="formSection_submit" style="text-align: left;">
                            <a  class="button active" style="margin-left: 80px;" onclick="upuserinfo()">保存</a>
                        </div>
                                            </form>

                </div>
            </div>
        </div>
        <input type="hidden" id="defaultheadimg" value="/public/lboyue/images/noData/avatar.png">
        <input type="hidden" id="newheadimg"   value="{$avatar}">
        <input type="hidden" id="isdefault" value="0">
    </div>


        </div>
{block name="include"}{include file="public:footer" /}{/block}
{/block}
{block name="script"}
	<script type="text/javascript" src="/public/lboyue/js/user.js"></script>
    <script type="text/javascript" src="/public/lboyue/js/jquery.from.js"></script>
    <script type="text/javascript">
        showCodeWindow();
        function setheadimg(listtype) {
            if (listtype == 2) {
                $("#headimg2").removeClass("active");
                $("#headimg1").addClass("active");
                var defaultheadimg = $("#defaultheadimg").val();
                $("#headimg").attr("src", defaultheadimg);
                $("#isdefault").val(1);
            } else {
                $("#headimg1").removeClass("active");
                $("#headimg2").addClass("active");
                var newheadimg = $("#newheadimg").val();
                $("#headimg").attr("src", newheadimg);
                $("#isdefault").val(0);
            }
        }
        // 提交状态标识 0可以提交 1昵称重复  2手机号格式错误 3 手机号已经存在  4密码包含特殊符号 5密码不一致
        var substatus = 0;
        // 昵称检测
        $("#nickname").blur(function () {
            var nickname = $(this).val();
            if (nickname == '' || nickname == undefined)
            {
                $("#nicknamemess").text("昵称为空");
                $("#nicknamemess").css("display", "block");
                $("#nickname").focus();
                return "";
            }
            $.ajax({
                url      : "/personal/checknickname",
                type     : "GET",
                dataType : "json",
                data     : {"nickname":nickname},
                success  : function (re) {
                    if (re.code != 1)
                    {
                        substatus = 0;
                        $("#nicknamemess").text(re.msg);
                        $("#nicknamemess").css("display", "block");
                    } else {
                        $("#nicknamemess").css("display", "none");
                        substatus = 1;
                    }
                },
                error    : function () {
                    malert("检测昵称出错,请稍后再试", 1200);
                    return "";
                    substatus = 1;
                }
            });
        });
        $("#phone").blur(function () {
            var phone = $(this).val();
            if (phone == "" || phone == undefined)
            {
                $("#phonemess").text("格式有误");
                $("#phonemess").css("display", "block");
                substatus = 2;
                return "";
            }
            if (!strcheck(phone, reg_phone))
            {
                $("#phonemess").text("格式有误");
                $("#phonemess").css("display", "block");
                substatus = 2;
                return "";
            }
            $.ajax({
                url      : "/personal/checkphone",
                type     : "GET",
                dataType : "json",
                data     : {"phone":phone},
                success  : function (re) {
                    if (re.code != 1) {
                        $("#phonemess").text(re.msg);
                        $("#phonemess").css("display", "block");
                        $("#phone").focus();
                        substatus = 3;
                    } else {
                        $("#phonemess").css("display", "none");
                        substatus = 0;
                    }
                },
                error    : function () {
                    malert("手机号检测失败,请稍后再试", 1200);
                    substatus = 3;
                    return "";
                }
            });
        });
        inputcheck($("#code2"),reg_verify,$("#codemess"));
        bindverifycode($("#getcode"), $("#phone"), 2, 0);
        $("#password").blur(function () {
            var password = $("#password").val();
			if (password != "") {
				if (!strcheck(password, reg_pass))
				{
					$("#passwordmess").text("包含特殊符号");
					$("#passwordmess").css("display", "block");
					substatus = 4;
					return "";
				}
			}else{
				if (password != "") {
					$("#passwordmess").css("display", "none");
				}
			}
        });
        $("#password2").blur(function () {
            var password2 = $(this).val();
            var password = $("#password").val();
            if (password != "") {
                if (password2 == "" || password2 == undefined)
                {
                    $("#password2mess").text("密码不能为空");
                    $("#password2mess").css("display", "block");
                    return "";
                } else {
                    if (!strcheck(password2, reg_pass))
                    {
                        $("#password2mess").text("包含特殊符号");
                        $("#password2mess").css("display", "block");
                        substatus = 4;
                        return "";
                    }
                    if (password != password2)
                    {
                        $("#password2mess").text("密码不一致");
                        $("#password2mess").css("display", "block");
                        substatus = 5;
                        return "";
                    } else {
                        $("#password2mess").css("display", "none");
                    }
                }
            } else {
                if (password2 != "") {
                    $("#passwordmess").text("密码不能为空");
                    $("#passwordmess").css("display", "block");
                }
            }

        });

        function upuserinfo() {
            var isdefault = $("#isdefault").val();
            var oldheadimg = $("#newheadimg").val();
            var nickname = $("#nickname").val();
            var phone = $("#phone").val();
            if (nickname == "" || nickname == undefined)
            {
                layer.msg("昵称不能为空", {time:1200});
                return '';
            }
            var code     = $("#code2").val();
            if (code == "" || code == undefined) {
                layer.msg("验证码不能为空", {time:1200});
                return '';
            }
            var password = $("#password").val();
            var password2 = $("#password2").val();
            var intro     = $("#intro").val();
            switch (substatus)
            {
                //1  2手机号格式错误 3 手机号已经存在  4密码包含特殊符号
                case 1:
                    malert("昵称重复", 1200);
                    return "";
                    break;
                case 2:
                    malert("手机号格式错误", 1200);
                    return "";
                    break;
                case 3:
                    malert("手机号已经存在", 1200);
                    return "";
                    break;
                case 4:
                    malert("密码包含特殊符号", 1200);
                    return "";
                    break;
                case 5:
                    malert("密码不一致", 1200);
                    return "";
                    break;
            }        
            
            var ajax_option = {
                url : "/api/member/edituserinfo",
                type : "POST",
				dataType : "json",
                data : {
                    "nickname" : nickname,
                    "code" : code,
                    "password" : password,
                    "password2" : password2,
                    "signature":intro,
                    "isdefault":isdefault,
                    "phone":phone,
                    "oldheadimg":oldheadimg,
                },
                success : function (data)
                {
                    //var data = eval("("+data+")");
					layer.msg(data.msg, {time: 1000});
                    if (data.code == 1)
                    {
						
                        var url = "/personal/info/";
                        setTimeout(function () {
                            window.location.href = url;
                        }, 1200);
                    }
                },
                error : function (re)
                {
                    layer.msg("服务器错误", {time: 1000});
                }
            };
            $("#myform").ajaxSubmit(ajax_option);
            return false;
        }
    </script>

	<script>
		$(document).ready(function () {
			bindnews();
			bindbookshelf();
			bindnav();
		});

	</script>
	<script>
	var maxWidth=360;
	var maxHeight=360;
	var result = document.getElementById("userPic"); 
	var _showImg=document.getElementById("headimg");
	var _inptuFileImg=document.getElementById("newheadimg");

	document.getElementById("imgUpload").addEventListener('change',userReadFile,false);
	
	function userReadFile(){
		var file = this.files[0]; 
		if(!/image\/\w+/.test(file.type)){ 
			alert("文件必须为图片！"); 
			return false; 
		} 
		var reader = new FileReader();
		var imgType=file.type;
		reader.onload = function(e){
			var img = new Image();
			img.src = e.target.result;
			img.onerror = function(){
				alert("图片加载错误!");
			};
			img.onload = function(){
				drawImage(img,imgType);
			};
			img.remove();
		}
		reader.readAsDataURL(file); 
	}

	function drawImage(img,imgType){
		var b64;
		var sw = img.width; 
		var sh = img.height;
		var tw = img.width; 
		var th = img.height; 
		var scale =sw/sh; 
		if (sw >maxWidth){ 
			tw = maxWidth; 
			th = Math.round(tw/scale); 
		} 
		if (sh>maxHeight){ 
			th = maxHeight; 
			tw = Math.round(th*scale); 
		}
		var canvas = document.createElement('canvas'); 
		var ctx = canvas.getContext('2d');
			canvas.width = tw; 
			canvas.height =th;
			ctx.drawImage(img,0,0,img.width,img.height,0,0,tw,th);
			b64=canvas.toDataURL(imgType);
			_inptuFileImg.value=b64;
			_showImg.src=b64;
			//_showImg.style.backgroundImage="url("+b64+")";
			//_showImg.style.backgroundSize="100%";
			canvas.remove();
	}
	</script>
{/block}


